//写一个小三角
.arrow-set(@width:50px){
  width: 0px;
  height: 0px;
  overflow: hidden;
  border-style: solid;
  border-width:@width ;
};
.arrow(@direction,@width:50px,@color:#000) when (@direction=down){//@direction控制三角的方向
  .arrow-set(@width);
  border-color: @color transparent transparent transparent ;
}
.arrow(@direction,@width:50px,@color:#000) when (@direction=left){//@direction控制三角的方向
  .arrow-set(@width);
  border-color:  transparent @color transparent transparent ;
}
.arrow(@direction,@width:50px,@color:#000) when (@direction=up){//@direction控制三角的方向
  .arrow-set(@width);
  border-color:  transparent transparent  @color transparent ;
}
.arrow(@direction,@width:50px,@color:#000) when (@direction=right){//@direction控制三角的方向
  .arrow-set(@width);
  border-color:  transparent transparent transparent  @color;
}


//调合调用
.box{
  .arrow(down,100px,#bfa);
}